<template >
  <el-watermark :font="font" :content="watermarkContent">
    <router-view/>
  </el-watermark>
</template>

<script setup>
import {computed, reactive} from 'vue'

import {useUserStore} from "@/store/index.js";

const userStore = useUserStore();
const font = reactive({
  color: 'rgba(0, 0, 0, .15)',
})

const watermarkContent = computed(() => {
  return [
    userStore.userInfo?.username || '',
    userStore.userInfo?.id || '',

  ]
})
</script>

<style>
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
</style>